import Vue from "vue";
import Vuex from "vuex";
import { getFolders } from "../helpers/folders";
import { getShowFolders, setShowFolders } from "../helpers/showFolders";
import { getFolderSize, setFolderSize } from "../helpers/folderSize";
import { getFolderSort, setFolderSort } from "../helpers/folderSort";
import { getTheme, setTheme } from "../helpers/theme";
import { getLocal, setLocal } from "../helpers/local";
import Folders from "../database/folders.json";

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    theme: getTheme(),// 当前模式
    folder: getFolders(),// 当前窗口
    folderSortType: getFolderSort(), //当前图标排序
    showDesktopIcons: getShowFolders(),// 当前是否显示桌面图标
    folderSize: getFolderSize(),// 当前图标大小
    apps: getLocal("apps") || Folders,// 当前显示图标？
    notifications: [],
    showDesktopNotifications: false,
    folderSizeList: [
      {
        name: "Large",
        shortName: "lg",
        size: "45px",
      },
      {
        name: "Medium",
        shortName: "md",
        size: "35px",
      },
      {
        name: "Small",
        shortName: "sm",
        size: "25px",
      },
    ],
  },
  // mutations 操作state
  mutations: {
    setFolders(state, data) {
      state.folders = data
    },
    setFolderSortType(state, type) {
      state.folderSortType = type;
      if (type == "Name" && state.apps.length) {
        // 名称排序
        state.apps = state.apps.sort(function (a, b) {
          var nameA = a.title.toUpperCase();
          var nameB = b.title.toUpperCase();
          if (nameA < nameB) return -1;
          if (nameA > nameB) {
            return 1;
          }
          return 0;
        })
      } else {
        state.apps = state.apps.sort(function (a, b) {
          // id 排序咯
          return a.id - b.id;
        });
      }
    }
  },
  // action派发事件给mutation
  actions: {
    // 设置软件
    fetchFolders(context, folders) {
      context.commit("setFolders", folders);
    },
    // 设置软件排序方式
    setFolderSort(context, type) {
      setFolderSort(type);
      context.commit("setFolderSortType", type);
      context.state.folderSortType = getFolderSort();
    },
    // 设置展示软件
    setShowFolders(context, value) {
      setShowFolders(value);
      context.state.showDesktopIcons = getShowFolders();
    },
    // 设置软件图标大小
    setFoldersSize(context, value) {
      setFolderSize(value);
      context.state.folderSize = getFolderSize();
    },
    // 设置主题
    setTheme(context, value) {
      setTheme(value);
      context.state.theme = getTheme();
    },
    // 更新软件
    updateApps(context, value) {
      context.state.apps = value;
    },
    // 设置提示信息，为什么要用定时器？
    setNotifications(context) {
      setTimeout(() => {
        context.state.notifications = getLocal("notifications") || [];
        context.state.showDesktopNotifications = true;
      }, 2000);
    },
    // 移除提示信息 
    removeNotification(context, value) {
      context.state.notifications = context.state.notifications.filter(
        (notification) => notification.title !== value.title
      );
      setLocal("notifications", context.state.notifications);
    },
    // 隐藏提示信息
    hideNotifications(context) {
      context.state.notifications = context.state.notifications.map(
        (notification) => {
          if (notification.show === true) notification.show = false;
          return notification;
        }
      );
      context.state.showDesktopNotifications = false;
      setLocal("notifications", context.state.notifications);
    },
    // 关闭提示信息？
    closeShowDesktopNotifications(context) {
      context.state.showDesktopNotifications = false;
    },
  },
  getters: {
    // 获得 安装app？
    getInstalledApps(state) {
      return state.apps.filter((app) => app.installed);
    },
  },

})